<template>
	<page  ref='page' top='100rpx'>
		<!-- 首页 wwl-->
		<view class="page">
			
			
			<!--店铺展示视频 -->
			<view class="bannarshang" v-if="shopdetail.carousel != null">
				<!-- <home-swiper :swiperList='bannerList' autoplay v-if='bannerList && bannerList.length > 0' /> -->
				<!-- autoplay -->
				<swiper class="banner" @change='intervalChange' circular autoplay interval="4000" duration="1000"
					indicator-active-color='#d5d5d5' indicator-color='#999'>
					<swiper-item style="position: relative;"
						v-for="(item,index) in shopdetail.video"
						:key='index'>
						<view class="swiper_item" @click="onPlay('myVideo')"  v-if="/(.*)\.(mp4|rmvb|avi|ts)$/.test(item)">
							<video :src='item'  :show-play-btn='false'
								:show-fullscreen-btn="false"
								:show-center-play-btn='false' style="width: 100%;height: 100%;" id="myVideo"
								ref="myVideo"></video>
							<image v-if=" !isplay" class="imagebanner"
								src="http://tuzhuang-1304727035.file.myqcloud.com/20211213/TSnh5LubCTshnjSS9mQ9LYrn8yV4asCA3boocVaU.png">
							</image>
						</view>
					</swiper-item>
					
					<swiper-item style="position: relative;"
						v-for="(item,index) in shopdetail.carousel"
						:key='index'>
						
						<view class="swiper_item"  >
							<image :src="item" mode="scaleToFill" :data-index="index" class="imagebanner"
								@click="$global.onPreview(item)" style="    background-size: 100% 100%;"></image>
						</view>
					</swiper-item>
				</swiper>
				<!-- <swiper class="banner"  circular autoplay  interval="4000" duration="1000"
					indicator-active-color='#d5d5d5' indicator-color='#999' indicator-dots>
					<swiper-item v-for="(item,index) in bannerList" :key='index' @click="gotoIndexOne(item,index)">
						<view class="swiper_item">
							<image :src="item.pic_url" mode="scaleToFill" :data-index="index" class="imagebanner"></image>
						</view>
					</swiper-item>
				</swiper> -->
			</view>
			<view class="bannarshang" v-if="shopdetail.carousel == null">
				<view class="swiper_item">
					<image src="https://tuzhuang-1304727035.file.myqcloud.com/images/52b750a59467f9bf8fa87cf22930b39c.png" mode="scaleToFill"  class="imagebanner" v-if="type == 3"></image>
					<image src="/static/image/icon/zhanwei1.png" mode="scaleToFill"  class="imagebanner" v-if="type != 3"></image>
				</view>
			</view>
			
			<!-- 店铺显示 -->
			<view class="quick_box4" :class="theme+'_boxbeijin'">
				<view class="row1" >
					<view class="row2" :class="type == 3 ? 'row311' : ''">
						<view class="row3" >
							<image :src="shopdetail.avatar" mode="scaleToFill" v-if="shopdetail.avatar != null && type != 3"></image>
							<image src="https://tuzhuang-1304727035.file.myqcloud.com/images/18e10127ec54e8e328174106ebd0e2d6.png" mode="scaleToFill" v-if="shopdetail.avatar == null && type == 3"></image>
							<image src="/static/image/icon/zhanwei2.png" mode="scaleToFill" v-if="shopdetail.avatar == null && type != 3"></image>
							<view class="row31" >
								<view class="row4" v-if="type != 3">
									{{shopdetail.name ? shopdetail.name : '暂无店铺'}}
								</view>
								<view class="row4" v-if="type == 3">
									图装监理
								</view>
								<view class="row5">
									
									<view class="" >
										<view v-if="type == 1">  {{shopdetail.like+shopdetail.collect+shopdetail.transmit}}人想找他施工</view>
										<view v-if="type == 2">  {{shopdetail.like+shopdetail.collect+shopdetail.transmit}}人想找他设计</view>
										<view v-if="type == 5">  {{shopdetail.like+shopdetail.collect+shopdetail.transmit}}人进店咨询</view>
										<view v-if="type == 6">  {{shopdetail.like+shopdetail.collect+shopdetail.transmit}}人进店咨询</view>
										<view v-if="type == 3">  图装将为您提供专业、全程的尽力服务</view>
									</view>
								</view>
							</view>
						</view>
						<view class="row6" >
							{{type != 3 ? shopdetail.shop_introduce : '图装监理将成为您家装的保障'}}
						</view>
						
					</view>
					<!-- 切换店铺 -->
					<view class="row7" v-if="craftsmanshoption.list.length > 0"  @click="shopdetailxians">
						<image src="https://tuzhuang-1304727035.file.myqcloud.com/images/566eea6b3dac49b56a7f3d17b52c895c.png" mode="scaleToFill"  v-if="type == 1"></image>
						<image src="https://tuzhuang-1304727035.file.myqcloud.com/images/d5ee94a2c7cd0662f26f11b997c5f670.png" mode="scaleToFill"  v-if="type == 2"></image>
						<!-- <image src="https://tuzhuang-1304727035.file.myqcloud.com/images/02e95bd953f29bfd6557e50a8f9b871b.png" mode="scaleToFill"  v-if="type == 3"></image> -->
						<image src="https://tuzhuang-1304727035.file.myqcloud.com/images/0b76bdf51d54894db9cf59ff049b677d.png" mode="scaleToFill"  v-if="type == 5"></image>
						<image src="https://tuzhuang-1304727035.file.myqcloud.com/images/0b76bdf51d54894db9cf59ff049b677d.png" mode="scaleToFill"  v-if="type == 6"></image>
					</view>
					
				</view>
				
				<!-- <view class="rowsheji1" v-if="shopdetail.type == 2"  >
					<view class="rowsheji2" @click='onChatphone(shopdetail.telephone)'>
						<image src="/static/image/icon/greendianhua.png" mode="scaleToFill" class="rowsheji4"></image>
						<view class="rowsheji3" >{{shopdetail.telephone}}</view>
					</view>
					<view class="rowsheji2" @click='$global.onOpenArea(shopdetail.latitude,shopdetail.longitude)'>
						<image src="https://tuzhuang-1304727035.file.myqcloud.com/images/c295b9c399db6227ea4423db2a79d548.png" mode="scaleToFill" class="rowsheji4"></image>
						<view class="rowsheji3" >{{shopdetail.address}}</view>
					</view>
					<view class="rowsheji2" @click='$global.onOpenArea(shopdetail.latitude,shopdetail.longitude)'>
						<image src="https://tuzhuang-1304727035.file.myqcloud.com/images/c295b9c399db6227ea4423db2a79d548.png" mode="scaleToFill" class="rowsheji4"></image>
						<view class="rowsheji3" >可支持在线异地设计</view>
					</view>
				</view> -->
				<view class="row8" >
					<view class="row9" >
						<view class="row10" v-if="type == 1">
							主营：装修施工
						</view>
						<view class="row10" v-if="type == 2">
							主营：装修设计
						</view>
						<view class="row10" v-if="type == 3">
							主营：装修监理
						</view>
						<view class="row10" v-if="type == 6">
							主营：{{shopdetail.build_city_name}}
						</view>
						<view class="row10" v-if="type == 5">
							主营：{{shopdetail.build_city_name}}
						</view>
						
						<view class="row11" >
							营业中 | 周一至周日 08:00-22:00
						</view>
					</view>
					<view class="row12" >
						<view class="row13" @click='$global.onOpenArea(shopdetail.latitude,shopdetail.longitude)' v-if="type != 3">
							<image src="https://tuzhuang-1304727035.file.myqcloud.com/images/c295b9c399db6227ea4423db2a79d548.png" mode="scaleToFill"></image>
							<view class="row14" >导航</view>
						</view>
						
						<view class="row13" @click='onChatphone(shopdetail.telephone)' v-if="type != 3">
							<image :src="'/static/image/icon/'+theme+'dianhua.png'" mode="scaleToFill" ></image>
							<view class="row14" >电话</view>
						</view>
						<view class="row13" @click='onChatphone(userInfo.phone)' v-if="type == 3">
							<image :src="'/static/image/icon/'+theme+'dianhua.png'" mode="scaleToFill" ></image>
							<view class="row14" >电话</view>
						</view>
					</view>
				</view>
			</view>
			
			
			<!-- 分类 -->
			<view class="quick_box3">
				<view class="row" v-if="type == 1" v-for='(item,index) in quickList' :key='index' @click="quickClick(item)">
					<image :src="item.img" mode="scaleToFill"></image>
					<text>{{item.name}}</text>
				</view>
				<view class="row" v-if="type == 2" v-for='(item,index) in desi_quickList' :key='index' @click="quickClick(item)">
					<image :src="item.img" mode="scaleToFill"></image>
					<text>{{item.name}}</text>
				</view>
				<view class="row" v-if="type == 3" v-for='(item,index) in supervisor_quickList' :key='index' @click="quickClick(item)">
					<image :src="item.img" mode="scaleToFill"></image>
					<text>{{item.name}}</text>
				</view>
				<view class="row" v-if="type == 5" v-for='(item,index) in changshang_quickList' :key='index' @click="quickClick(item)">
					<image :src="item.img" mode="scaleToFill"></image>
					<text>{{item.name}}</text>
				</view>
				<view class="row" v-if="type == 6" v-for='(item,index) in business_quickList' :key='index' @click="quickClick(item)">
					<image :src="item.img" mode="scaleToFill"></image>
					<text>{{item.name}}</text>
				</view>
			</view>
			
			
			<view v-if='type == 3 && commodity.list && commodity.list.length > 0' class="list">
				<view class="row" v-for='(row,i) in commodity.list' :key='i'>
					<view class="title" :class="theme">
						
						<view class="title2" >
							{{row.project_task.address}} ({{row.type == 0 ? '正常日报' :  row.type == 1 ? '开始施工' :  row.type == 2 ? '完工申请' :  row.type == 3 ? '验收合格' :  row.type == 4 ? '日常巡检' : '' }})
						</view>
						<view class="title3" >
							已通过
						</view>
					</view>
					<view class="role" v-if='row.users'>
						<view class="left">
							<image :src="row.users.avatar" mode="scaleToFill"></image>
						</view>
						<view class="right">
							<view class="right_left">
								<view class="">
									{{row.users.name}}
								</view>
								<view class="">
									<text>{{row.role_type == 1 ? '工长': '设计师' }}</text>
									<text>{{row.type == 0 ? '正常日报' : row.type == 1? '开始施工':row.type == 2 ? '完成施工':row.type == 3 ? '验收合格' :''}}</text>
								</view>
							</view>
							<view class="right_right">
								{{row.date}}
							</view>
						</view>
					</view>
					<view class="text" v-if='row.content'>
						{{row.content}}
					</view>
					<view class="img" v-if='row.img_arr && row.img_arr.length > 0'>
						<image :src="img" mode="scaleToFill"  v-for="(img,im) in row.img_arr" :key='im'></image>
					</view>
					<view class="button_box" v-if="row.status  == 3">
						<button :loading="loading && currentId" class="btn btn1" @click="onAdopt(row.id,i)">审核通过</button>
						<button class="btn btn2" @click="onReject(row.id,i)">驳回</button>
					</view>
				</view>
			</view>
			
			<!-- 商品展示 -->
			<view class="tab_row" v-if="type != 3">
				<view class="row" :class="tabgoodsqie == 1?'tab_xuanzhong':''" @click="shopgoodsqie(1)">
					{{type == 1 ? '推荐' : type == 2 ? '推荐' : type == 3 ? '推荐' : type == 5 ? '综合' : type == 6 ? '综合' : '推荐'}}
				</view>
				<view class="row" :class="tabgoodsqie == 2?'tab_xuanzhong':''" @click="shopgoodsqie(2)">
					全部商品
				</view>
				<!-- <view class="row" @click="changeTab(row.id)" v-for="(row,index) in tabList" :key='index' :class="tabActive == row.id?'tab_active':''">
					{{row.name}}
				</view> -->
			</view>
			<view class="list_box" v-if="type != 3">
				<block >
					<view class="fenlei1"  v-if="tabgoodsqie == 2 && type==1">
						<view class="fenlei">
							<image src="https://tuzhuang-1304727035.file.myqcloud.com/images/4f4ff1d0edabc8ba3fcd5e89a0194e93.png" mode="scaleToFill" class="fenleiimg" @click="fenlei(0,'全部商品')"></image>
							<text class="wenzi">全部商品</text>
						</view>
						<view class="fenlei" v-for='(clatop,index) in commodity.classifytop' :key='index' @click="fenlei(clatop.id,clatop.name)">
							<image :src="clatop.iconimgurl" mode="scaleToFill" class="fenleiimg"></image>
							<text class="wenzi">{{clatop.name}}</text>
						</view>
						
					</view>
					
					<view v-if='commodity.total != 0 '  style="margin-top: -30rpx;" >
						<renovation-row :list='commodity.list' :source='source' :type='type' :page='commodity.page' :size='commodity.limit' :offer='offer' :duihuan='duihuan' />
						<loadingText :type="loading || commodity.page * commodity.limit < commodity.total" />
					</view>
					<empty  :status='2' v-else/>
				</block>
				
			</view>
			<!-- 店铺列表弹窗 -->
			<view class="row721" v-if="shopsh == 1">
				<view class="row722"  v-for='(item,index) in craftsmanshoption.list' :key='index' >
					<view class=""  @click="shopdetailzong(item)">{{item.name}}</view>
				</view>
			</view>
			<!-- 灰色遮罩层 -->
			<view class="zhezhao" v-if="shopsh == 1" @click="shopdetailxians"></view>
			
			<!-- <view class="quick_box5">
				<view class="row" >
					<view >推荐</view>
					<view>全部商品</view>
				</view> -->
				<!-- 推荐 -->
				<!-- <view class="row" v-for='(item,index) in designshoption.list' :key='index' @click="quickClick(item)">
					<image :src="item.cover" mode="scaleToFill"></image>
					<text>{{item.name}}</text>
				</view> -->
				<!-- 全部商品 -->
				<!-- <view class="row" v-for='(item,index) in craftsmanshoption.list' :key='index' @click="quickClick(item)">
					<image :src="item.img" mode="scaleToFill"></image>
					<text>{{item.name}}</text>
				</view>
			</view> -->
			
			
			<foot />
			
		</view>
	</page>
</template>

<script>
	import uPopup from '@/components/u-popup.vue'
	import tabRow2 from '@/components/tab-row2.vue'
	import renovationRow from '@/components/renovation-row.vue'
	import  renovationShop  from "@/components/renovation-shop.vue"
	
	import { mapState,mapMutations,mapGetters } from 'vuex'
	
	import {
		getShopListDefault,
		getShopDetail,
		getGoodsList,
		getGZGoodsList,
		getDailyReviewList,setDailyReview,
		
		getJCCGoodsNav,
		getJCCGoodsList,
		getDGGoodsList,
		getShopList,
		getbuildingMaterialsCityType,getbuildingMaterialsCitysGoodsList,getCityName,
		getHomeCarousel,
		getHometellAbout,
		getHomeFindInspiration,
		getFindDesignshopList,
		getFindCraftsman,
		commonGetConfig
	} from '@/utils/getRequest.js'
	export default {
		components: {
			uPopup,
			tabRow2,
			renovationRow,
			renovationShop
		},
		data() {
			return {
				tabgoodsqie:1,
				shopsh:0,
				id:0,
				
				source:0,
				offer:'',
				duihuan:0,
				
				tabList:[],
				tabActive:1,
				type:0,
				juese:0,
				classificationList:[],
				classificationLists:[],
				have_tell:1,    //1：隐藏，  2：显示
				have_idea:1,    //1：隐藏，  2：显示
				integral: {
					visible: true,
				},
				activeTab: 0,
				homeTopBgc: "rgba(0,0,0,0.2)",
				isReachBottom: 0,
				controls: false,
				bannerActive: 0,
				isplay: false,
				bannerTime: null,
				bannerList: [],
				designshoption: {
					list: [],
					total: 0,
					page: 1,
					offer:0,
					limit: 27,
					loading: false,
					heightList: [0, 0],
				},
				
				craftsmanshoption: {
					list: [],
					shopres:[],
					total: 0,
					page: 1,
					offer:0,
					limit: 27,
					loading: false,
					heightList: [0, 0],
				},
				buildingshoption: {
					list: [],
					total: 0,
					page: 1,
					limit: 27,
					offer:0,
					loading: false,
					heightList: [0, 0],
				},
				findInspiration: {
					list: [],
					total: 0,
					page: 1,
					limit: 10,
					loading: false,
					heightList: [0, 0],
				},
				quickList: [
					
					{
						img: 'https://tuzhuang-1304727035.file.myqcloud.com/images/373fb4e1579e410b6b7b20f42694c509.png',
						name: '店铺简介',
						intstype: 4,
						url: '/pagesCommodity/shopProfile'
					}
				],
				desi_quickList: [
					
					{
						img: 'https://tuzhuang-1304727035.file.myqcloud.com/images/373fb4e1579e410b6b7b20f42694c509.png',
						name: '店铺简介',
						intstype: 4,
						url: '/pagesCommodity/shopProfile'
					}
				],
				business_quickList: [
					
				],
				supervisor_quickList: [
					{
						img: 'https://tuzhuang-1304727035.file.myqcloud.com/images/373fb4e1579e410b6b7b20f42694c509.png',
						name: '个人档案',
						intstype: 8,
						url: '/pagesServiceProvider/supervisor/personalProfile'
					}
				],
				changshang_quickList: [
					
				],
				more: false,
				tellAboutList: [],
				page: 1,
				limit: 6,
				loading: false,
				shopdetail:[],
				
				commodity:{
					isFirst:true,
					page:1,
					size:10,
					total:0,
					list:[],
					classifytop:[],
				},
				
				//监理的
				currentId:null,
				supervisorlist:[],
				dianpuetype:'',
			}
		},
		onReachBottom(x) {
			if(this.commodity.page * this.commodity.size >= this.commodity.total || this.loading) return
			this.commodity.page ++
			if(this.type == 3){
				this.getsupervisorList()
			}else{
				this.getshopgoodsList()
			}
			
			
			
			// if (this.findInspiration.page * this.findInspiration.limit >= this.findInspiration.total || this
			// 	.findInspiration.loading) return
			// this.findInspiration.page++
			// this.getFindInspiration()
			
			
		},
		onPullDownRefresh(){
			// this.onGetBannerList()
			// this.getTellAboutList()
			this.findInspiration.page = 1
			// this.getFindInspiration()
		},
		methods: {
			//监理日报审核
			async onAdopt(id,i){
				this.currentId = id
				if(this.loading) return  
				this.loading = true
				try{
					var res = await setDailyReview({id:id,status:1})
					this.loading = false
					uni.showToast({title:'审核成功'})
					this.commodity.list.splice(i,1)
				}catch{
					this.loading = false
				}
			},
			onReject(id){
				uni.navigateTo({url:`/pagesServiceProvider/intersection/reasonsRejection?id=${id}&type='dailyReview'`})
			},
			//查询监理日报审核内容
			async getsupervisorList(){
				uni.showLoading()
				try{
					var res = await getDailyReviewList({status:1})
					console.log(res,'监理审核日报的')
					this.commodity.list = res
					this.commodity.total = res ? res.length : 0
					uni.hideLoading()
				}catch{
					uni.hideLoading()
				}
			},
			
			fenlei(id,name){
				console.log(name, '分类名');
				
				var shopping_id = this.info.id;
				uni.navigateTo({
					url:`/pagesCommodity/classifitop?classifitop_id=${id}&typeName=${encodeURIComponent(name)}&shopping_id=${shopping_id}`
				})
			},
			
			onShop(row,status){
				console.log(row, '传过来的数据');
				if(status == 3){
					// 跳转到店铺
					uni.navigateTo({
						url:`/pagesCommodity/shopDetailsDefault?id=${row.id}&name=${encodeURIComponent(row.name)}&offer=0&source=0&duihuan=0&shouquan=0&yunshop=0`
					})
				}else{
					var type = 'findDesign';
					if(status == 1){
						var type = 'findDesign';
					}else if(status == 2){
						var type = 'findCraftsman';
					}
					uni.navigateTo({
						url:`/pagesCommodity/shopDetailsDefault?type=${type}&id=${row.id}&name=${encodeURIComponent(row.name)}&source=0&offer=0&duihuan=0&shouquan=0&yunshop=0`
					})
				}
			},
			
			async getList(){
					this.buildingshoption.loading = true;
					if(this.buildingshoption.page == 1) uni.showLoading() 
					
							var res = await getShopList({
								jiancai:1,
								page:this.buildingshoption.page,limit:this.buildingshoption.limit,
								zone_id:this.$store.state.currentArea ? this.$store.state.currentArea.cityId : '',
								user_id: this.buildingshoption.offer == 2  && this.$store.state.chat_to ? this.$store.state.chat_to.id : ''
							})
					// }
					this.buildingshoption.list =  this.buildingshoption.page == 1 ? res.list : [...this.buildingshoption.list,...res.list];
					console.log(this.buildingshoption.list, '商品列表');
					this.buildingshoption.total = res.count
					this.buildingshoption.loading = false
					
					if(res.shopcount < 1){
						uni.showToast({title:'您的档案地址服务商家不足1个，已为您展示其他服务商家',icon:'none',duration:2000})
					}
					
					if(this.buildingshoption.page == 1) uni.hideLoading() 
				
			},
			async getClassificationList(){
				if(this.buildingshoption.page == 1)  uni.showLoading()
				this.buildingshoption.loading = true
				try{
					console.log(this.tabActive, '分类点击');
					if(this.tabActive == 0){
						this.getList()
					}else if(this.tabActive == 1){
						console.log(this.tabActive, '分类点击啊 ');
						var res = await getDGGoodsList({page:this.buildingshoption.page,limit:this.buildingshoption.limit,jiancai:1,zone_id:this.$store.state.currentArea ? this.$store.state.currentArea.cityId : ''})
						
							var list = this.buildingshoption.page == 1 ?  res.list : [...this.classificationList,...res.list];
							// this.classificationLists  = 
							this.classificationList  = list;
							console.log(res,'兑换前');
					}else{
						var res = await getJCCGoodsList({page:this.buildingshoption.page,limit:this.buildingshoption.limit,zone_id:this.$store.state.currentArea ? this.$store.state.currentArea.cityId : '',type:this.tabActive})
						var list = this.buildingshoption.page == 1 ?  res.list : [...this.classificationList,...res.list];
						
						this.classificationList  = list;
					}
					
					
					
					
					
					this.buildingshoption.total = res.count
					this.buildingshoption.loading = false
					
					if(this.buildingshoption.page == 1)  uni.hideLoading()
					uni.stopPullDownRefresh()
				}catch{
					uni.hideLoading()
					this.buildingshoption.loading = false
					uni.stopPullDownRefresh()
				}
			},
			changeTabs(c){
				// if(c != 0){
				// 	this.tabActive = c-1
				// }else{
					this.tabActive = c
				// }
				
				this.buildingshoption.page = 1
				console.log(c,'分类点击爱上的发生短发');
				if(c == 0){
					// this.getList()
				}else{
					this.getClassificationList()
				}
			    
			},
			async getTabList(){
				
				try{console.log('分类1');
					var res = await getJCCGoodsNav({status:1})
					// var res = await getJCCGoodsNav({status:1})
					console.log(res,'分类');
					// res.unshift(["id":0,"name":'建材城']);
					
					this.tabList = res
					this.$refs.tabs.active = 1
					this.changeTabs(1)
					// this.getList()
				}catch{}
			},
			
			async onGetBannerLists() {
				console.log('阿斯达 ');
				this.getTabList()
			},
			
			
			//获取工长店铺,各个角色的店铺
			async FindCraftsmanshop() {
				this.craftsmanshoption.loading = true
				if(this.craftsmanshoption.page == 1) uni.showLoading()
				
				try {
					// console.log(this.craftsmanshoption.page,'首页工长1');
					// console.log(this.craftsmanshoption.limit,'首页工长2');
					// var res = await getShopListDefault({
					// 	page: this.craftsmanshoption.page,
					// 	limit: this.craftsmanshoption.limit,
					// 	type:this.type
					// })
					
					// console.log(res,'首页工长');
					
					// this.craftsmanshoption.list = this.craftsmanshoption.page == 1 ? res.list : [...this.craftsmanshoption.list, ...res.list]
					console.log(this.id,'店铺ID')
					//获取默认第一个店铺的详情.
					var shopres = await getShopDetail({
						id: this.id
					})
					console.log(shopres,'店铺详情');
					
					this.shopdetail = shopres;
					uni.setStorageSync('shopId', this.shopdetail.id);
					
					this.getshopgoodsList()
					// var data = this.craftsmanshoption.list
					// var list = []
					// 						//一次显示3个
					// for (var i = 0, len = data.length; i < len; i += 2) {
					// 	list.push(data.slice(i, i + 2));
					// }
					// this.craftsmanshoption.list=[]
					// for(var j=0;j<list.length;j++){
					// 	this.craftsmanshoption.list.push(list[j])
					// }
					
					this.craftsmanshoption.total = res.count
					this.craftsmanshoption.loading = false
					
					if(this.craftsmanshoption.page == 1) uni.hideLoading()
					uni.stopPullDownRefresh()
					
					
				} catch {
					this.craftsmanshoption.loading = false
					uni.hideLoading()
					uni.stopPullDownRefresh()
				}
			},
			//获取某个店铺商品
			async getshopgoodsList(){
				if(this.commodity.page == 1) uni.showLoading()
				this.loading = true
				
					console.log(this.type,'店铺角色信息');
					if(this.type == 1){
						var res = await getGZGoodsList({id:this.shopdetail.id,page:this.commodity.page,limit:this.commodity.size})
					}else{
						var res = await getGoodsList({id:this.shopdetail.id,page:this.commodity.page,limit:this.commodity.size})
					}
					console.log(res,'商品信息');
					this.commodity.list = this.commodity.page == 1 ? res.list : [...this.commodity.list,...res.list]
					this.commodity.total = res.count
					this.commodity.isFirst = false
					this.commodity.page = res.page
					this.commodity.size = res.limit
					this.commodity.classifytop = res.classifytop
					if(this.commodity.page == 1) uni.hideLoading()
					this.loading = false
				
			},
			
			
			shopgoodsqie(val){
				if(val == 1){
					this.tabgoodsqie = val;
					this.getshopgoodsList()
				}else{
					this.tabgoodsqie = val;
					this.getshopgoodsList()
				}
				
				
			},
			//显示店铺列表
			shopdetailxians(){
				if(this.shopsh == 0){
					this.shopsh = 1;
				}else{
					this.shopsh = 0;
				}
				
			},
			//获取某个店铺详情
			shopdetailzong(val) {
				console.log(val,'店铺详情获取');
				this.shopsh = 0;
				this.shopid = val.id
				
				this.shopdetails()
				this.getshopgoodsList()
				
			},
			//获取某个店铺详情
			async shopdetails(id) {
				// console.log(this.craftsmanshoption.limit,'店铺详情ID2');
				this.loading = true
				
				var res = await getShopDetail({
					id: this.shopid
				})
				
				console.log(res,'店铺详情');
				
				this.shopdetail = res;
				
				uni.setStorageSync('shopId', this.shopdetail.id);
				
				this.loading = false
			},
			//轮播图视频播放
			intervalChange(e) {
				this.bannerActive = e.detail.current
				if (this.isplay) this.onPlay('myVideo')
			},
			//轮播图视频播放
			onPlay(id) {
				if (!this.isplay) {
					this.isplay = true
					var videoCtx2 = uni.createVideoContext(id);
					videoCtx2.play();
					//#ifndef MP-WEIXIN
					setTimeout(() => {
						videoCtx2.play();
					}, 200);
					// #endif
				} else {
					var videoCtx = uni.createVideoContext(id);
					videoCtx.pause();
					this.isplay = false
					//#ifndef MP-WEIXIN
					setTimeout(() => {
						videoCtx.pause();
					}, 200);
					// #endif
				}
			},
			//拨打电话
			onChatphone(phone){
				// #ifdef APP-PLUS
				
				
				plus.android.requestPermissions(
					["android.permission.CALL_PHONE"], 
					function(resultObj) {
						var result = 0;
						for (var i = 0; i < resultObj.granted.length; i++) {
							var grantedPermission = resultObj.granted[i];
							console.log('已获取的权限：' + grantedPermission);
							result = 1
						}
						for (var i = 0; i < resultObj.deniedPresent.length; i++) {
							var deniedPresentPermission = resultObj.deniedPresent[i];
							console.log('拒绝本次申请的权限：' + deniedPresentPermission);
							result = 0
						}
						for (var i = 0; i < resultObj.deniedAlways.length; i++) {
							var deniedAlwaysPermission = resultObj.deniedAlways[i];
							console.log('永久拒绝申请的权限：' + deniedAlwaysPermission);
							result = -1
						}
						console.log(result);
						if(result == 1){
							uni.makePhoneCall({
								 phoneNumber: phone.toString(),//电话号码
								success(ress) {
									console.log("拨打电话成功",ress)
								},
								fail(err) {
									console.log("拨打电话失败",'err')
								}
							});
						}else{
							uni.showToast({
								title:"请开启拨号权限",
								icon:"error",
							})
						}
					},
					function(error) {
						console.log('申请权限错误：' + error.code + " = " + error.message);
					}
				);
				// #endif
				// #ifdef MP-WEIXIN
				uni.makePhoneCall({
					phoneNumber:phone.toString(),//电话号码
					success:function(e){
						console.log(e,'成功');
					},
					fail:function(e){
						console.log(e,'失败');
				 
					}
				})
				// #endif
				
			},
			tiaozhuang(status){
				if(status == 1){
					uni.navigateTo({
						url:'/pagesCommodity/findDesign/index'
					})
				}else if(status == 2){
					uni.navigateTo({
						url:'/pagesCommodity/findCraftsman/index'
					})
				}else if(status == 3){
					uni.navigateTo({
						url:'/pagesCommodity/buildingMaterialsCity/index'
					})
				}
				
				
			},
			
			
			
			onChat() {
				if (this.$store.getters.userInfo) {
					uni.navigateTo({
						url: '/pagesChat/systemMessage'
					})
				} else {
					this.$global.getUserInfo()
				}
			},
			
			
			//分类页面跳转
			quickClick(row) {
				if(row.intstype == 1){
					uni.navigateTo({
						url:row.url + '?shopping_id=' + this.shopdetail.id+ '&juese=' + this.juese
					});
				}else if(row.intstype == 2){
					uni.navigateTo({
						url:row.url + '?shoptype=' + this.shopdetail.type + '&shopping_id=' + this.shopdetail.id+ '&juese=' + this.juese
					});
				}else if(row.intstype == 3){
					uni.navigateTo({
						url:row.url + '?type=' + this.type + '&shopId=' + this.shopdetail.id+ '&juese=' + this.juese
					});
				}else if(row.intstype == 4){
					uni.navigateTo({
						url:row.url + '?shoptype=' + this.shopdetail.type + '&shopping_id=' + this.shopdetail.id+ '&users_id=' + this.shopdetail.users_id
					});
				}else{
					uni.navigateTo({
						url:row.url + '?type=' + this.type + '&shopId=' + this.shopdetail.id+ '&juese=' + this.juese
					});
				}
				
			},
			
			onShortVideo(row, index) {
				var pageIndex =  index == 0 ? 1 :  Math.ceil(index / this.findInspiration.limit) 
				uni.navigateTo({
					url: `/pagesHome/shortVideo?id=${row.id }&page=${pageIndex}&size=${this.findInspiration.limit}`
				})
			},
			
			
			...mapMutations(['updateTheme']),
		},
		// onReady() {
		// 	this.getFindInspiration()
		// },
		computed: {
			...mapState(['theme']),
			userInfo() { // amount 现在余额 、  income 总收入 、 withdrawals 总支出
				return this.$store.state.userInfo
			}
		},
		onLoad(params) {
			// if (!this.$store.state.userInfo && params.invitation_code && params.invitation_code !=
			// 	'null') {
			// 	this.$store.commit('setInvitationCode', params.invitation_code)
			// 	// uni.setStorageSync('TZ_invitation_code', params.invitation_code)
			// } else {
			// 	this.$store.commit('setInvitationCode', null)
			// 	// uni.removeStorageSync('TZ_invitation_code')
			// }
			// uni.getSystemInfo({
			// 	success: (e) => {
			// 		if (e && e.statusBarHeight) this.$store.commit('setStatusBarHeight', e
			// 			.statusBarHeight)
			// 	}
			// })
			// if (this.$store.state.newUser == 1) {
			// 	this.integral.visible = true
			// } else {
			// 	this.integral.visible = false
			// }
			// this.onGetBannerList();
			// this.getTellAboutList();
			// this.getConfigIdea();
			// this.getConfig();
			
			//判断角色，对应角色查对应的第一个店铺跟商品
			// console.log(this.$store.state.userInfo,'获取角色信息')
			
			if(params.duihuan)this.duihuan = params.duihuan;
			if(params.offer)this.offer = params.offer;
			if(params.source) this.source = params.source
			if(params.shouquan) this.shouquan = params.shouquan
			console.log(this.shouquan,'精算单传参');
			this.id = params.id;
			this.dianpuetype = params.type;
			console.log(this.dianpuetype,'获取角色信息')
			
			if(params.name){
				this.name =  decodeURIComponent(params.name)
				uni.setNavigationBarTitle({
				    title: this.name
				});
			}
			
			//type1工长2设计师3监理4经纪人5厂商6建材商
			// this.type = this.$store.state.userInfo.user_role_id[0];
			//dianpuetype工长findCraftsman设计findDesign建材商
			// uni.setStorageSync('type', this.type);
			if(this.dianpuetype == 'findCraftsman'){
				this.updateTheme('yellow')
				uni.setStorageSync('theme','yellow')
				this.juese = 2;
				this.type = 1;
				this.FindCraftsmanshop();
			}else if(this.dianpuetype == 'findDesign'){
				this.updateTheme('green')
				uni.setStorageSync('theme','green')
				this.juese = 3;
				this.type = 2;
				console.log(this.dianpuetype,'获取角色信息')
				this.FindCraftsmanshop();
			}else if(this.dianpuetype == 'buildingMaterialsCity'){
				
				this.updateTheme('red')
				uni.setStorageSync('theme','red')
				this.juese = 1;
				this.type = 6;
				this.FindCraftsmanshop();
			}
			// else if(this.dianpuetype == 4){
			// 	this.updateTheme('yellow')
			// 	uni.setStorageSync('theme','yellow')
			// 	this.juese = 5;
			// 	this.FindCraftsmanshop();
			// }else if(this.dianpuetype == 5){
			// 	this.updateTheme('red2')
			// 	uni.setStorageSync('theme','red2')
			// 	this.juese = 4;
			// 	this.FindCraftsmanshop();
			// }else if(this.dianpuetype == 6){
			// 	this.updateTheme('red')
			// 	uni.setStorageSync('theme','red')
			// 	this.juese = 1;
			// 	this.FindCraftsmanshop();
			// }
			//监理的备注
			//this.getsupervisorList();
			// this.updateTheme('blue')
			// uni.setStorageSync('theme','blue')
			
			uni.setStorageSync('juese', this.juese);
			
			// this.onGetBannerLists()
		}
	}
</script>

<style lang="scss" scoped>
	
	.xiazx{
		padding: 10px 16px;
		.row{
			border-top: 1px solid #dcdcdc;
			padding: 10px 0px;
			.left{
				width: 50%;
				text-align: left;
				font-size: 16px;
				font-weight: 600;
				display: inline-block;
			}.right{
				width: 50%;
				text-align: right;
				font-size: 12px;
				line-height: 18px;
				display: inline-block;
			}
		}
		.imgssname{
			.banner{
				width: 100%;
				height: 420rpx;
				
			}
			.bann2{
				display: flex;
				    justify-content: space-between;
			}
			.kong{
				// margin-right: 20rpx;
			}
			.item{
				width: 262rpx;
				// display: inline-block;
				margin-top: 10rpx;
				margin-left: 10rpx;
				margin-right: 10rpx;
				// flex: 1;
				
			}
			.goods_name{
				font-size: 24rpx;
				white-space: nowrap;
				text-overflow:ellipsis;
				overflow:hidden;
				display: block;
			}
			.jingyan{
				line-height: 12px;
				font-size: 20rpx;
				display: flex;
				justify-content: space-between;
				.congy{
					white-space: nowrap;
					text-overflow:ellipsis;
					overflow:hidden;
					display: inline-block;
					width: 154rpx;
					
				}
				.dianzan{
					
				}
				.dianzanimg{
					width: 20rpx;
					height: 20rpx;
				}
			}
			.imgtil{
				width: 100%;
				height: 330rpx;
				border-radius: 10px;
				box-shadow: 0px 1px 5px #4a4a4a;
			}
		}
	}
	.banner{
		width: 100%;
		height: 226px;
		.swiper_item{
			height: 100%;
		}
	}
	.imagebanner{
		width: 100%;
		height: 226px;
	}
	page {
		background: #FFFFFF !important;
	}

	.page {
		width: 100%;
		padding-bottom: 120rpx;
		overflow: hidden;
	}

	.tabber_box .tabber_box_static {
		width: 100%;
		background-color: #fff;
	}

	.tabber_box .tabber_box_flex {
		width: 100%;
		background-color: #fff;
		position: fixed;
		z-index: 999;
		top: 0;
		left: 0;
	}

	.tabber_box_title_static {
		height: 80rpx;
		width: 100%;
		background-color: #fff;
	}

	.tabber_box_title_flex {
		background-color: #fff0;
		position: fixed;
		left: 0;
		right: 0;
		top: 0;
		z-index: 99;
		height: 80rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 42rpx;
		font-family: PingFang SC, PingFang SC-Semibold;
		font-weight: 700;
		text-align: center;
		color: #ffffff;

		.left {
			margin-top: 4rpx;
			position: absolute;
			left: 58rpx;
			top: 50%;
			transform: translateY(-50%);

			image {
				width: 36rpx;
				height: 36rpx;
			}

			text {
				display: inline-block;
				position: absolute;
				left: 34rpx;
				top: 5px;
				width: 10rpx;
				height: 10rpx;
				background: $theme;
				border-radius: 50%;
			}
		}
		
		.text{
			/* 设置描边宽度及颜色 默认为字体内外描边 */
			  text-stroke: 2rpx #a0a0a0;
			  /* 兼容Webkit(Chrome/Safari)内核浏览器的写法 */
			  -webkit-text-stroke: 2rpx #a0a0a0;
		}
	}

	.quick_box1 {
		display: flex;
		padding: 50rpx 38rpx 0;
		box-sizing: border-box;
		width: 100%;
		justify-content: space-between;

		.row {
			width: 326rpx;
			display: flex;
			justify-content: center;
			// justify-content: space-between;

			.left {
				image {
					width: 112rpx;
					height: 112rpx;
				}
			}

			.right {
				margin-left: 20rpx;
				// width: calc(100% - 128rpx);
				display: flex;
				flex-direction: column;
				// align-items: center;
				justify-content: center;

				>text:nth-child(1) {
					font-family: PingFang SC, PingFang SC-Semibold;
					font-weight: 600;
					font-size: 32rpx;
					line-height: 44rpx;
					color: #000000;
				}

				>text:nth-child(2) {
					font-size: 22rpx;
					font-family: PingFang SC, PingFang SC-Medium;
					color: #adadad;
					line-height: 32rpx;
					margin-top: 2rpx;
				}
			}
		}
	}

	.quick_box2 {
		display: flex;
		padding: 62rpx 38rpx 0;
		box-sizing: border-box;
		width: 100%;
		justify-content: space-between;

		.row {
			width: 326rpx;
			display: flex;
			justify-content: space-between;

			image {
				width: 326rpx;
				height: 190rpx;
				border-radius: 20rpx;
			}
		}
	}

	.quick_box3 {
		display: flex;
		padding: 80rpx 38rpx 28rpx 38rpx;
		box-sizing: border-box;
		width: 100%;
		justify-content: space-between;
		margin-bottom: 20rpx;
		position: relative;
		    top: -40px;
		box-shadow: 0px 8px 1px 2px #e4e4e4;

		.row {
			flex: 1;
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;

			image {
				width: 88rpx;
				height: 88rpx;
				margin-bottom: 16rpx;

			}

			text {
				color: #000000;
				line-height: 40rpx;
				font-size: 28rpx;
			}
		}
	}
	
	.yellow_boxbeijin{
		box-shadow: 0px 2px 4px 1px #fad2568a;
	}
	.blue_boxbeijin{
		box-shadow: 0px 2px 4px 1px $blue2;
	}
	.green_boxbeijin{
		box-shadow: 0px 2px 4px 1px $green2;
	}
	.red_boxbeijin{
		box-shadow: 0px 2px 4px 1px $red2;
	}
	.red2_boxbeijin{
		box-shadow: 0px 2px 4px 1px $red2;
	}
	.quick_box4 {
		position: relative;
		    top: -30px;
			z-index: 99;
		display: inline-block;
		    margin: 0px 19px 0;
		    box-sizing: border-box;
		    width: -webkit-fill-available;
		    justify-content: space-between;
		    margin-bottom: 0px;
		    background: #ffffff;
		    border-radius: 6px;
			padding: 14px 12px;
		image {
			width: 88rpx;
			height: 88rpx;
			margin-bottom: 16rpx;
		}
			
		text {
			color: #000000;
			line-height: 40rpx;
			font-size: 28rpx;
		}
		.row1 {
			display: flex;
			    /* flex-direction: column; //可以让flex的分类变成上下*/
			    justify-content: left;
			    align-items: center;
		}
		.row2 {
			flex: 0 0 74%;
			display: flex;
			    flex-direction: column;
		}
		.row3 {
			display: flex;
			image {
				width: 88rpx;
				height: 88rpx;
				margin-bottom: 16rpx;
				border-radius: 50%;
			}
		}
		.row31 {
			flex: 0 0 70%;
			padding-left: 16px;
		}
		.row311{
			flex: 0 0 100%;
		}
		
		.row4 {
			font-size: 18px;
			    font-weight: 600;
		}
		.row5 {
			font-size: 12px;
			    margin-top: 8px;
		}
		.row6 {
			font-size: 12px;
			    margin-top: 14px;
		}
		.row7 {
			flex: 0 0 20%;
			position: relative;
			    right: -30px;
			image {
				width: 144rpx;
				height: 70rpx;
			}
		}
		
		.row8 {
			border-top: 1px solid #999;
			display: flex;
			    margin-top: 10px;
			    padding: 10px 4px 0px 4px;
			justify-content: flex-start;
			    align-items: center;
		}
		.row9 {
			flex: 0 0 70%;
		}
		.row10 {
			font-size: 16px;
			    font-weight: 600;
		}
		.row11 {
			font-size: 12px;
		}
		.row12 {
			display: flex;
			    
			flex: 0 0 30%;
			justify-content: flex-end;
		}
		
		.row13 {
			font-size: 12px;
			margin-left: 10px;
			
			image {
				width: 44rpx;
				height: 44rpx;
				margin-bottom: 12rpx;
			}
		}
		
		.rowsheji1{
			
		}
		.rowsheji2{
			font-size: 14px;
		}
		.rowsheji3{
			display: inline-block;
			    height: 20px;
			    margin-left: 10px;
			    position: relative;
			    bottom: 12px;
		}
		.rowsheji4{
			display: inline-block;
			width: 20px;
			    height: 20px;
		}
		
	}

	.tell_about {
		margin-bottom: 77rpx;
		padding: 0 38rpx;
		box-sizing: border-box;

		.list {
			padding-top: 39rpx;
			display: flex;
			flex-wrap: wrap;

			.row {
				width: 326rpx;
				height: 186rpx;
				margin-bottom: 43rpx;
				position: relative;
				border-radius: 20rpx;

				.video {
					width: 326rpx;
					height: 186rpx;
					border-radius: 20rpx;
				}

				&:nth-child(2n + 1) {
					margin-right: 20rpx;
				}

				.title {
					position: absolute;
					left: 0;
					bottom: 0;
					width: 326rpx;
					height: 44rpx;
					background: rgba(0, 0, 0, .3);
					border-radius: 0rpx 0rpx 22rpx 22rpx;
					font-size: 20rpx;
					color: #E6E6E6;
					line-height: 44rpx;
					padding: 0 20rpx;
					box-sizing: border-box;
					white-space: nowrap;
					overflow: hidden;
					text-overflow: ellipsis;
				}

				.icon {
					position: absolute;
					left: 50%;
					top: 50%;
					transform: translate(-50%, -50%);
					width: 44rpx;
					height: 44rpx;

				}
			}
		}
	}

	.row_title {
		display: flex;
		justify-content: center;
		align-items: center;

		.text {
			font-size: 32rpx;
			line-height: 44rpx;
			font-family: PingFang SC, PingFang SC-Semibold;
			font-weight: 600;
			padding: 0 33rpx;
			color: #000000;
		}

		.row {
			width: 35%;
			height: 2rpx;
			background-color: red;
		}

		.row1 {
			background: linear-gradient(60deg, #ffffff 6%, #808080 82%);
		}

		.row2 {
			background: linear-gradient(60deg, #808080 6%, #ffffff 82%, );
		}


	}

	.find_inspiration {
		padding: 0 38rpx;
		width: 100%;
		box-sizing: border-box;

		.list {
			position: relative;
			margin-top: 39rpx;
			// -moz-column-count: 2;
			// -webkit-column-count: 2;
			// column-count: 2;
			// -moz-column-gap: 1em;
			// -webkit-column-gap: 1em;
			// column-gap: 1em;
			// position: relative;
			image {
				display: block;
				will-change: transform;
			}
			.row {
				position: absolute;
				width: 326rpx;
				// margin-top: 1em;
				// -moz-page-break-inside: avoid;
				// -webkit-column-break-inside: avoid;
				// break-inside: avoid;

				.image {
					width: 326rpx;
					height: 326rpx;
					// height: 100%;
					display: block;
					border-radius: 20rpx;
					margin-bottom: 12rpx;
				}

				.img_box {
					width: 326rpx;
					height: auto;
				}

				.name {
					font-size: 24rpx;
					line-height: 34rpx;
					font-family: PingFang SC, PingFang SC-Semibold;
					font-weight: 600;
					text-align: left;
					color: #101010;
					margin-bottom: 10rpx;
					display: block;
					overflow: hidden;
					word-break: break-all;
					text-overflow: ellispsis;
					display: -webkit-box;
					-webkit-line-clamp: 2;
					-webkit-box-orient: vertical;
				}

				.look {
					display: flex;
					justify-content: flex-end;
					align-items: center;
					image {
						width: 28rpx;
						height: 19rpx;
						margin-right: 5rpx;
					}

					text {
						color: #ADADAD;
						font-size: 20rpx;
						line-height: 28rpx;
					}
				}
			}
		}
	}

	.reject_popup2 {
		// background-color: #fff;
		position: relative;
		width: 750rpx;
		height: 730rpx;
		display: flex;
		align-items: flex-start;

		.image {
			width: 750rpx;
			height: 648rpx;
		}

		.icon {
			position: absolute;
			bottom: 0;
			left: 50%;
			transform: translateX(-50%);
			width: 74rpx;
			height: 74rpx;
		}

	}
	.tip_loaidng{
		width: 100%;
		padding: 30rpx 0 ;
		box-sizing: border-box;
		text-align: center;
		font-size: 24rpx;
		color:#666;
	}
	.bannarshang{
		position: relative;
		    top: 0;
		    left: 0;
		    right: 0;
		    z-index: 98;
	}
	
	.quick_box5{
		position: absolute;
		    top: 490px;
		width: 100%;
		
		
		
		
	}
	
	
	.row721{
		position: fixed;
		z-index: 101;
		    top: 38%;
		    left: 34%;
		    background: #FAD256;
		    padding: 14px 12px;
		    font-size: 14px;
		    color: #000;
		    box-shadow: 0px 1px 4px 1px #c7c7c7;
	}
	.row722{
		line-height: 28px;
		background: #fff;
		text-align: center;
		padding: 0 10px;
		    border-bottom: 1px solid #999;
	}
	.zhezhao{
		position: fixed;
		    top: 0;
		    z-index: 100;
		    background: #00000087;
		    width: 100%;
		    height: 100%;
	}
	
	
	.fenlei1{
		display: inline-block;
		font-size: 12px;
		.fenlei{
			float: left;
			width: 25%;
			height: 80px;
			text-align: center;
			.wenzi{
				margin-top: 5px;
				display: block;
			}
			.fenleiimg{
				background-size: 100% 100%;
				width: 56%;
				height: 56%;
				margin: 0 auto;
				display: block;
				// border-radius: 50px;
			}
		}
	}
	.tab_row{
		padding: 0rpx 36rpx 0rpx;
		width: 100%;
		box-sizing: border-box;
		display: flex;
		position: relative;
		top:-20px;
		.row{
			flex:1;
			text-align: center;
			color:#B2B2B2;
			font-size: 30rpx;
			line-height: 50rpx;
		}
		.tab_active{
			font-size: 36rpx;
			line-height: 50rpx;
			color:#121212;
			font-weight: 700;
		}
		.tab_xuanzhong{
			color: #000;
			    font-size: 36rpx;
			    font-weight: 700;
		}
	}
	
	.list_box{
		padding: 0 36rpx;
		box-sizing: border-box;
		width: 100%;
		min-height: 30vh;
		.brief_introduction{
			.row{
				margin-bottom: 64rpx;
				.title{
					font-size: 36rpx;
					line-height: 50rpx;
					color:#000000;
					margin-bottom: 20rpx;
				}
				.center{
					margin-top: 20rpx;
					font-size: 28rpx;
					color:#000;
					line-height: 52rpx;
				}
				.img{
					margin-top: 46rpx;
					width: 100%;
					image{
						height: 298rpx;
						margin-bottom: 32rpx;
						&:last-child{
							margin-bottom: 0;
						}
					}
				}
				&:last-child{
					margin-bottom: 0;
				}
			}
		}
		.case_box {
			.MlSon {
				width: 100%;
				margin-bottom: 68rpx;
				.MlSonvBox {
					width: 100%;
					.SonOfImg {
						width: 100%;
						height: 406rpx;
						border-radius: 22rpx;
						.Img {
							width: 100%;
							height: 100%;
							border-radius: 22rpx;
						}
					}
				}
		
				.SonOfName {
					width: 100%;
					margin-top: 20rpx;
					.SNTop {
						width: 100;
						font-size: 30rpx;
						font-family: PingFang SC, PingFang SC-Medium;
						font-weight: 500;
						color: #000000;
					}
		
					.SNBom {
						width: 100%;
						margin-top: 10rpx;
						display: flex;
						justify-content: space-between;
						align-items: center;
		
						.SNBom_left {
							width: calc(100% - 120rpx);
							display: flex;
							align-items: center;
							.SNBom_img {
								width: 44rpx;
								height: 44rpx;
								border-radius: 50%;
							}
		
							.SBleft {
								max-width: calc(100% - 54rpx);
								white-space:nowrap;
								overflow:hidden;
								text-overflow:ellipsis;
								word-break: break-all;
								font-size: 20rpx;
								font-family: PingFang SC, PingFang SC-Regular;
								font-weight: 400;
								color: #adadad;
								margin-left: 14rpx;
								text{
									display: inline-block;
								}
								.square{
									font-size: 30rpx;
									  display: inline-block;
									  transform: scale(0.6) translateY(-10%);
								}
							}
						}
		
						.SNBom_right {
							display: flex;
							align-items: center;
		
							.SBright_img {
								width: 28rpx;
								height: 18rpx;
							}
		
							.SBright {
								font-size: 20rpx;
								font-family: PingFang SC, PingFang SC-Medium;
								font-weight: 500;
								color: #adadad;
								margin-left: 5rpx;
							}
						}
					}
				}
			}
		}
	}
	
	
	//监理的css
	.list{
		padding:  20rpx 36rpx;
		width: 100%;
		box-sizing: border-box;
		.row{
			border-bottom: 2rpx solid #EBEBEF;
			padding-bottom: 78rpx;
			margin-bottom: 40rpx;
			&:last-child{
				border-bottom:0
			}
			.title{
				width: 100%;
				padding: 26rpx 22rpx 24rpx;
				box-sizing: border-box;
				border-radius: 16rpx;
				color:#fff;
				font-size: 28rpx;
				line-height: 40rpx;
				.title2{
					display: inline-block;
				}
				.title3{
					display: inline-block;
					    text-align: right;
					    width: 65%;
				}
			}
			.role{
				margin-top: 18rpx;
				display: flex;
				justify-content:space-between;
				.left{
					image{
						width: 60rpx;
						height: 60rpx;
						margin-top: 12rpx;
						border-radius: 50%;
					}
				}
				.right{
					width: calc(100% - 80rpx);
					display: flex;
					justify-content: space-between;
					align-items: center;
					.right_left{
						width: calc(100% - 140rpx);
						>view:nth-child(1){
							color:#26252A;
							font-size: 24rpx;
							line-height: 24rpx;
							margin-bottom: 8rpx;
						}
						>view:nth-child(2){
							>text{
								display: inline-block;
								border-radius: 4rpx;
								display: inline-block;
								padding: 2rpx 16rpx;
								font-size: 18rpx;
								line-height: 26rpx;
								background-color: #5194D5;
								color:#fff;
								&:last-child{
									margin-left: 8rpx;
									background-color: #e8e8e8;
									color:#606060;
								}
							}
						}
					}
					.right_right{
						width: 140rpx;
						font-size: 24rpx;
						line-height: 34rpx;
						color:#BBBBBB
					}
				}
			}
			.text{
				margin-top: 20rpx;
				font-size: 32rpx;
				line-height: 44rpx;
				color:#26252A;
				word-break: break-all;
	
			}
			.img{
				margin-top: 20rpx;
				display: flex;
				flex-wrap:wrap;
				image{
					width: 216rpx;
					height: 216rpx;
					margin: 0 14rpx 12rpx 0;
					&:nth-child(3n){
						margin-right: 0;
					}
				}
			}
			.button_box{
				margin-top: 40rpx;
				display: flex;
				justify-content: center;
				.btn{
					width: 162rpx;
					height: 60rpx;
					background: $theme;
					border-radius: 8rpx;
					font-size: 24rpx;
					color:#fff;
					
				}
				.btn2{
					border: 2rpx solid #bbbbbb;
					box-sizing: border-box;
					margin-left: 70rpx;
					background-color: #fff;
					color:#BBBBBB
				}
			}
		}
	}
	
</style>
